<script lang="ts" setup>
import {ref} from 'vue'
import {useI18n} from 'vue-i18n'

const {locale} = useI18n()
const changeLang = (lang: string) => {
  locale.value = lang
  localStorage.setItem('lang', lang)// 重要！下面遇到问题里解释
}
</script>

<template>
  {{ $t("message.hello") }}

  <button @click="locale='zh'">中文</button>
  <button @click="locale='en'">英文</button>
  
</template>

<style>
.v-enter-active,
.v-leave-active {
  transition: opacity 5s ease;
}

.v-enter-from,
.v-leave-to {
  opacity: 0;
}
</style>
